<template>
  <el-container>
    <el-header><el-button type="primary" :icon="add">新增用户</el-button></el-header>
    <el-main><el-table :data="tableData" style="width: 100%">
        <el-table-column label="ID" width="180">
          <template #default="scope">
            <div style="display: flex; align-items: center">
              <el-icon>
                <timer />
              </el-icon>
              <span style="margin-left: 10px">{{ scope.row.id }}</span>
            </div>
          </template>
        </el-table-column>
        <el-table-column label="用户名" width="180">
          <template #default="scope">
                <div>{{ scope.row.username }}</div>
          </template>
        </el-table-column>
        <el-table-column label="是否为管理员">
          <template #default="scope">
            <el-switch v-model="scope.row.is_superuser" disabled/>
          </template>
        </el-table-column>
      </el-table></el-main>
  </el-container>
</template>

<script setup>
import { ref, onMounted } from "vue"
import axios from '../utils/http.js'
let tableData = ref([])
onMounted(()=>{
  axios({
    url:'userinfo/',
    method:'GET'

  }).then(res=>{
    tableData.value = res.data.data
  }).catch(err=>{
  })
})
</script>

<style scoped></style>